import debounce from 'lodash/debounce';
import { ref, watch, onUnmounted } from 'vue';

/**
 * 防抖hook
 * @param {Function} callback - 要执行的回调函数
 * @param {number} delay - 延迟时间（毫秒），默认300ms
 * @param {Object} options - debounce配置选项
 * @returns {Object} 包含防抖函数和取消方法的对象
 */
export function useDebounce(callback, delay = 300, options = {}) {
  const debouncedFn = debounce(callback, delay, options);

  // 清理函数
  const cancel = () => {
    debouncedFn.cancel();
  };

  // 组件卸载时自动清理
  onUnmounted(() => {
    cancel();
  });

  return {
    debouncedFn,
    cancel,
  };
}

/**
 * 防抖值hook
 * @param {Ref} sourceRef - 要监听的响应式引用
 * @param {Function} callback - 值变化时的回调函数
 * @param {number} delay - 延迟时间（毫秒），默认300ms
 * @param {Object} options - debounce配置选项
 * @returns {Object} 包含防抖值和取消方法的对象
 */
export function useDebounceValue(
  sourceRef,
  callback,
  delay = 300,
  options = {},
) {
  const debouncedValue = ref(sourceRef.value);

  const debouncedFn = debounce(
    (newValue) => {
      debouncedValue.value = newValue;
      if (callback) {
        callback(newValue);
      }
    },
    delay,
    options,
  );

  watch(sourceRef, (newValue) => {
    debouncedFn(newValue);
  });

  // 清理函数
  const cancel = () => {
    debouncedFn.cancel();
  };

  // 组件卸载时自动清理
  onUnmounted(() => {
    cancel();
  });

  return {
    debouncedValue,
    cancel,
  };
}
